$(function () {
 
  //切换登录、注册盒子的切换
  /* 
点击去注册 ，让注册盒子显示，登陆盒子隐藏
点击去登陆，让注册盒子隐藏，登陆盒子显示
*/
  $("#link_reg").on("click", function () {
    $(".login-box").hide();
    $(".reg-box").show();
  });

  $("#link_login").on("click", function () {
    $(".reg-box").hide();
    $(".login-box").show();
  });
  //二：实现注册功能
  /* 
1、给表单注册submit提交事件
2、阻止表单默认提交行为
3、收集表单数据
4、给表单做非空校验
5、拿数据发起ajax请求
6、判断请求成功与否
7、如果请求成功，显示登陆盒子
*/
  /* 
    对用户名和邮箱做非空校验
    密码长度是6-15位的非空字符
    要求确认密码和输入密码保持一致
    */

  layui.form.verify({
    pwd: [/^[\S]{6,15}$/, "密码必须6到15位,且不能出现空格"],
    repwd: function (value, item) {
      /* 
        value是确认密码的值，item但是确认密码框（DOM元素）
        确认密码的值和密码框中的值对比
        获取密码框的值
        */
      const password = $("#form_reg [name=password]").val().trim();
      //比对
      if (value !== password) {
        return "两次密码输入不一致";
      }
    }
  });
  $("#form_reg").on("submit", function (e) {
    //2、阻止表单默认提交行为
    e.preventDefault();
    //收集表单数据
    const username = $("#form_reg [name=username]").val().trim();
    const password = $("#form_reg [name=password]").val().trim();
    //4、给表单做非空校验

    //5、拿数据发起ajax请求
    $.ajax({
      method: "post",
      url: "/api/reguser",
      data: {
        username,
        password
      },
      success: function (res) {
        console.log(res);
        //判断请求成功与否
        const { status, message } = res;
        if (status !== 0) return layer.msg(message, { icon: 5 });
        layer.msg(message, { icon: 6 });
        //如果请求成功，显示登陆盒子
        $("#link_login").click();
      }
    });
  });

  //三：实现登录功能
  /* 
  给登录表单注册submit 
  阻止表单默认提交
  收集表单数据
  做校验
  发起ajax请求
  判断请求成功与否
  如果成功，跳转首页
  */

  $("#form_login").on("submit", function (e) {
    //阻止表单默认提交
    e.preventDefault();
    //收集表单数据
    const data = $(this).serialize();
    //发起ajax请求
    $.ajax({
      method: "post",
      url: "/api/login",
      data,
      success: function (res) {
        console.log(res);
        const { status, message } = res;
        if (status !== 0) return layer.msg(message, {
            icon: 5
          });
        layer.msg(message, function () {
          //将token保存在本地(做身份认证 JWT身份认证)
          localStorage.setItem("token", res.token);
          //如果成功，跳转首页
          location.href = "/index.html";
        });
      }
    });
  });
});
